<%@ page contentType="text/html;charset=UTF-8" language="java"%>
<%@include file="/WEB-INF/webpage/common/taglibs.jspf"%>
<!DOCTYPE html>
<html lang="en">
	<head>
		<title>添加任务</title>
		<meta name="renderer" content="webkit">
		<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
		<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
		<link type="text/css" rel="stylesheet" href="${staticPath}/layui/css/layui.css">
		<link type="text/css" rel="stylesheet" href="${staticPath}/layui/modules/css/index.css">
		<link type="text/css" rel="stylesheet" href="${staticPath}/layui/modules/css/task.css">
	</head>
	<body>
	    <form class="layui-form">
	   		<div class="add_task_content">
		        <ul>
		           <li>
					   <span>客户名称:</span>
					  <%-- <select name="userId" lay-verify="required" style="width:150px;" lay-ignore id="userId">
						   <option value=""></option>
						   <c:forEach items="${users}" var="user">
							   <option value="${user.id}"
									 <c:if test="${user.id==data.userId}">
										  selected = "selected"
									  </c:if>
							   >${user.name}</option>
						   </c:forEach>
					   </select>--%>
					   	<input type="text" lay-verify="required" autocomplete="off"  class="layui-input" style="width:70px;" name="userName" id="userName" value="${data.userName }">
		           		<span>店铺名称:</span>
						   <%--<select name="shopId" lay-verify="required" style="width:150px;" lay-ignore id="shopName">
						   </select>--%>
					   	<input type="text" lay-verify="required" autocomplete="off"  class="layui-input" style="width:70px;" name="shopName" id="shopName" value="${data.shopName }">
		           		<span>价格￥</span>
		           		<input type="text" name="price" lay-verify="required|number"  autocomplete="off" class="layui-input" style="width:115px;" value="${data.price }"/>
		           	</li>
					<li>
						<input type="hidden" name="id" id="id" value="${data.id }">
						<span>客单价备注</span>
						<input type="text" name="title" id="title" lay-verify="required" autocomplete="off" class="layui-input" style="width:77%" value="${data.title }">
					</li>
		        </ul>
		        <ul>
		            <li>
		            	<span>任务数量</span>
		            	<input type="text" name="orderCount" lay-verify="required|number" autocomplete="off"  class="layui-input" style="width:70px;" value="${data.orderCount }"/>
		            </li>
		            <li>
		            	<span>搜关键词1</span>
		            	<input name="keyword" autocomplete="off" class="layui-input" style="width:440px;" value="${data.keyword }"/>
		            </li>
					<li>
						<span>搜关键词2</span>
						<input name="keyword2" autocomplete="off" class="layui-input" style="width:440px;" value="${data.keyword2 }"/>

					</li>
					<li>
						<span>搜关键词3</span>
						<input name="keyword3" autocomplete="off" class="layui-input" style="width:440px;" value="${data.keyword3 }"/>
					</li>
					<li>
						<span>搜关键词4</span>
						<input name="keyword4" autocomplete="off" class="layui-input" style="width:440px;" value="${data.keyword4 }"/>
					</li>
					<li>
						<span>搜关键词5</span>
						<input name="keyword5" autocomplete="off" class="layui-input" style="width:440px;" value="${data.keyword5 }"/>
					</li>
		            <li>
		            	<span>筛选条件</span>
		            	<input type="text" name="offerLink" autocomplete="off" class="layui-input" style="width:85%;margin-left:15px;" value="${data.offerLink }"/>
		            </li>
		            <li>
		            	<span>城市合伙人</span>
						<input type="text" name="remarks" id="remarks" autocomplete="off" class="layui-input" style="width:77%" value="${data.remarks }">
		            </li>
		        </ul>
		        <div class="add_task_button">
		            <button class="layui-btn hscolor" type="reset">清空信息</button>
		            <button class="layui-btn layui-btn-normal" lay-submit lay-filter="insert">发布任务</button>
		        </div>
		    </div>
		    <div class="add_task_photo" style="margin-top: 10px;text-align:center;">
				<div class="layui-upload-list">
					<c:if test="${data.imgUrl==null || data.imgUrl==''}">
					<img class="layui-upload-img" id="image" >
					</c:if>
					<c:if test="${data.imgUrl!=null && data.imgUrl!=''}">
						<img class="layui-upload-img" id="image" src="${ctx}${data.imgUrl}">
					</c:if>
					<p id="demoText"></p>
				</div>
				<input type="hidden" name="imgUrl" id="imgUrlStr" value="${data.imgUrl}">
				<button type="button" class="layui-btn layui-btn-normal" id="import">上传图片</button>

		    </div>
	    </form>
	    <script src="${staticPath}/layui/layui.js"></script>
		<script>
			layui.use(['jquery','layer','form','upload'], function(){
	    	    var $ = layui.jquery,form = layui.form,layer = layui.layer,upload = layui.upload;
	    	    //监听提交
	    	    form.on('submit(insert)', function(data){
	    	        /*var shopName=$("#shopName").find("option:selected").text();
                    data.field.shopName=shopName;*/
	    	    	layer.load(1);
	    	        $.ajax({
	    	    	    url: '${adminPath}/client/task/create', 
					    data:data.field,
		    		    type: "POST", 
		    		    dataType: "JSON", 
		    		    success: function(result){
		    		    	layer.closeAll('loading');
		    			    if(result.ret==0){
			                    layer.alert(result.msg, {icon: 0, title:'提示',end: function(){
			                    	var index=parent.layer.getFrameIndex(window.name);
				    			    parent.layer.close(index);
			                    }});
			                }else{
			                    layer.alert(result.msg, {icon: 0, title:'警告'});
			                }	
					    },
			    	    error: function () {
			    	    	layer.closeAll('loading');
			    	        layer.msg("未知错误，请联系管理员！",{icon: 2});
		                }
	    		    });
	    	        return false;
	    	    });

                //普通图片上传
                var uploadInst = upload.render({
                    elem: '#import'
                    ,url: '${adminPath}/client/task/upload/'
                    ,before: function(obj){
                        //预读本地文件示例，不支持ie8
                        obj.preview(function(index, file, result){
                            $('#image').attr('src', result); //图片链接（base64）
                        });
                    }
                    ,done: function(res){
                        //如果上传失败
                        if(res.ret > 0){
                            return layer.msg('上传失败');
                        }else{
                            $("#imgUrlStr").val('${appPath}/'+res.data[0].filepath);
						}
                        //上传成功
                    }
                    ,error: function(){
                        //演示失败状态，并实现重传
                        var demoText = $('#demoText');
                        demoText.html('<span style="color: #FF5722;">上传失败</span> <a class="layui-btn layui-btn-xs demo-reload">重试</a>');
                        demoText.find('.demo-reload').on('click', function(){
                            uploadInst.upload();
                        });
                    }
                });
                $("#userId").bind({
					change:function(){
					    var userid = $(this).val();
					    if(userid==""){
                            $("#shopName").html("");
						}else{
                            getShopList(userid,'');
						}

					}
				})
                getShopList('${data.userId}','${data.shopId}');
                function getShopList(userid,shopid){
                    if(!userid){
                        return false;
					}
                    var param ={
                        queryFields: 'id,shopName,',
                    }
                    if(userid==""){
                        delete param['query.userId||eq'];
                    }else{
                        param['query.userId||eq']=userid;
                    }
                    $.ajax({
                        url: '${adminPath}/client/shop/ajaxList',
                        data:param,
                        type: "POST",
                        dataType: "JSON",
                        success: function(data){
                            var options =[];
                            options.push("<option value=''></option>")
                            $.each(data.results,function(index,val){
                                options.push("<option value='"+val.id+"' ");
                                if(shopid&&shopid==val.id){
                                    options.push("selected='selected'")
								}
                                options.push("'>"+val.shopName+"</option>");
                            });
                            $("#shopName").html(options.join(''));
                        },
                        error: function () {
                            layer.closeAll('loading');
                            layer.msg("未知错误，请联系管理员！",{icon: 2});
                        }
                    });
                }

                $("#userId").bind({
                    change:function(){
                        $("#userName").val($(this).find("option:selected").text());
                    }
                });
	    	});

		</script>
	</body>
</html>